<style>
@import '/pages/public/index.css';
</style>
<template>
	<view class="public-container">
		<!-- 顶部导航栏 -->
		<view class="nav-bar">
			<view class="user-info">
				<image class="avatar" src="/static/avatar-default.png"></image>
				<text class="welcome">欢迎回来，社会公众</text>
			</view>
			<view class="search-box">
				<input type="text" placeholder="输入搜索的关键词" />
			</view>
		</view>

		<!-- 主要功能区 -->
		<scroll-view scroll-y class="main-content">
			<!-- 生命教育模块 -->
			<view class="module-section">
				<view class="module-header">
					<text class="module-title">生命教育</text>
					<text class="module-more">更多 ></text>
				</view>
				<view class="function-cards">
					<view class="function-card" @click="navigateTo('/pages/public/education/concept')">
						<image class="card-image" src="/static/life-concept.png"></image>
						<text class="card-title">生命概念</text>
					</view>
					<view class="function-card" @click="navigateTo('/pages/public/education/value')">
						<image class="card-image" src="/static/life-value.png"></image>
						<text class="card-title">生命价值</text>
					</view>
					<view class="function-card" @click="navigateTo('/pages/public/education/meaning')">
						<image class="card-image" src="/static/life-meaning.png"></image>
						<text class="card-title">生命意义</text>
					</view>
				</view>
			</view>

			<!-- 生命故事模块 -->
			<view class="module-section">
				<view class="module-header">
					<text class="module-title">生命故事</text>
					<text class="module-more">更多 ></text>
				</view>
				<view class="story-cards">
					<view class="story-card" @click="navigateTo('/pages/public/stories/featured')">
						<image class="story-image" src="/static/featured-stories.png"></image>
						<text class="story-title">精选故事</text>
					</view>
					<view class="story-card" @click="navigateTo('/pages/public/stories/categories')">
						<image class="story-image" src="/static/story-categories.png"></image>
						<text class="story-title">故事分类</text>
					</view>
					<view class="story-card" @click="navigateTo('/pages/public/stories/community')">
						<image class="story-image" src="/static/story-community.png"></image>
						<text class="story-title">故事社区</text>
					</view>
				</view>
			</view>

			<!-- 公益活动模块 -->
			<view class="module-section">
				<view class="module-header">
					<text class="module-title">公益活动</text>
					<text class="module-more">更多 ></text>
				</view>
				<view class="activity-cards">
					<view class="activity-card" @click="navigateTo('/pages/public/activities/volunteer')">
						<image class="activity-image" src="/static/volunteer.png"></image>
						<text class="activity-title">志愿服务</text>
					</view>
					<view class="activity-card" @click="navigateTo('/pages/public/activities/donation')">
						<image class="activity-image" src="/static/donation.png"></image>
						<text class="activity-title">爱心捐赠</text>
					</view>
					<view class="activity-card" @click="navigateTo('/pages/public/activities/events')">
						<image class="activity-image" src="/static/events.png"></image>
						<text class="activity-title">线下活动</text>
					</view>
				</view>
			</view>

			<!-- 知识资源模块 -->
			<view class="module-section">
				<view class="module-header">
					<text class="module-title">知识资源</text>
					<text class="module-more">更多 ></text>
				</view>
				<view class="resource-cards">
					<view class="resource-card" @click="navigateTo('/pages/public/resources/articles')">
						<image class="resource-image" src="/static/articles.png"></image>
						<text class="resource-title">文章阅读</text>
					</view>
					<view class="resource-card" @click="navigateTo('/pages/public/resources/videos')">
						<image class="resource-image" src="/static/videos.png"></image>
						<text class="resource-title">视频课程</text>
					</view>
					<view class="resource-card" @click="navigateTo('/pages/public/resources/books')">
						<image class="resource-image" src="/static/books.png"></image>
						<text class="resource-title">推荐书籍</text>
					</view>
				</view>
			</view>

			<!-- AI助手模块 -->
			<view class="ai-assistant-section" @click="navigateTo('/pages/public/aiChat')">
				<view class="ai-card">
					<view class="ai-icon">🤖</view>
					<view class="ai-info">
						<text class="ai-title">AI智能助手</text>
						<text class="ai-desc">了解生命教育，探索生命意义</text>
					</view>
					<view class="ai-arrow">></view>
				</view>
			</view>
		</scroll-view>

		<!-- 底部导航栏 -->
		<view class="tab-bar">
			<view class="tab-item active">
				<view class="tab-icon">🏠</view>
				<text class="tab-text">首页</text>
			</view>
			<view class="tab-item" @click="navigateTo('/pages/public/storyMuseum')">
				<view class="tab-icon">🏛️</view>
				<text class="tab-text">故事博物馆</text>
			</view>
			<view class="tab-item" @click="navigateTo('/pages/public/aiChat')">
				<view class="tab-icon">💬</view>
				<text class="tab-text">AI对话</text>
			</view>
			<view class="tab-item" @click="navigateTo('/pages/public/profile')">
				<view class="tab-icon">👤</view>
				<text class="tab-text">我的</text>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {

		}
	},
	methods: {
		navigateTo(url) {
			// 判断是否是底部导航栏的页面
			if (url.includes('/pages/public/index') ||
				url.includes('/pages/public/storyMuseum') ||
				url.includes('/pages/public/aiChat') ||
				url.includes('/pages/public/profile')) {
				uni.switchTab({
					url: url
				});
			} else {
				uni.navigateTo({
					url: url
				});
			}
		}
	}
}
</script>